package cloud.banson.emojilizer.ui.home

import android.net.Uri
import androidx.compose.animation.animateContentSize
import androidx.compose.animation.core.Spring
import androidx.compose.animation.core.spring
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.*
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Done
import androidx.compose.material.icons.filled.ExpandLess
import androidx.compose.material.icons.filled.ExpandMore
import androidx.compose.material.ripple.rememberRipple
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.ImageBitmap
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.imageResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import cloud.banson.emojilizer.R
import cloud.banson.emojilizer.ui.theme.Blue
import cloud.banson.emojilizer.ui.theme.GreenA100
import cloud.banson.emojilizer.ui.theme.GreenA400
import com.skydoves.landscapist.glide.GlideImage

@Composable
fun TouchableCard(
    name: String,
    image: Uri?,
    expanded: Boolean,
    onClick: (Boolean) -> Unit,
    colorBackground: Color
) {
    val interactionSource = remember { MutableInteractionSource() }
    Card(
        backgroundColor = colorBackground,
        modifier = Modifier
            .padding(vertical = 4.dp, horizontal = 8.dp)
            .clickable(
                interactionSource = interactionSource,
                indication = rememberRipple(bounded = true),
                onClick = { onClick(false) }
            )
    ) {
        CardContent(
            name = name,
            image = image,
            expanded = expanded,
            onClick = onClick,
        )
    }
}

@Composable
@Preview(showBackground = true)
private fun TouchableCardPreview() {
    TouchableCard(
        name = "Touchable",
        image = null,
        expanded = true,
        onClick = {},
        colorBackground = Blue
    )
}

@Composable
fun SimpleCard(
    name: String = stringResource(R.string.save_to_gallery),
    onClick: () -> Unit
) {
    val interactionSource = remember { MutableInteractionSource() }
    Card(
        backgroundColor = GreenA100,
        modifier = Modifier
            .padding(vertical = 4.dp, horizontal = 8.dp)
            .clickable(
                interactionSource = interactionSource,
                indication = rememberRipple(bounded = true),
                onClick = onClick
            ),
    ) {
        Row(modifier = Modifier.padding(12.dp)) {
            Column(
                modifier = Modifier
                    .weight(1f)
                    .padding(12.dp)
            ) {
                Text(
                    text = name,
                    style = MaterialTheme.typography.body1.copy(
                        fontWeight = FontWeight.ExtraBold
                    )
                )
            }
            IconButton(onClick = onClick) {
                Icon(
                    imageVector = Icons.Filled.Done,
                    contentDescription = name
                )
            }
        }
    }
}

@Composable
@Preview(showBackground = true)
private fun SimpleCardPreview() {
    SimpleCard(
        name = "Simple",
        onClick = {},
    )
}

@Composable
fun CardContent(name: String, image: Uri?, expanded: Boolean, onClick: (Boolean) -> Unit) {
    Row(
        modifier = Modifier
            .padding(12.dp)
            .animateContentSize(
                animationSpec = spring(
                    dampingRatio = Spring.DampingRatioNoBouncy,
                    stiffness = Spring.StiffnessLow
                )
            )
    ) {
        Column(
            modifier = Modifier
                .weight(1f)
                .padding(12.dp)
        ) {
            Text(
                text = name,
                style = MaterialTheme.typography.body1.copy(
                    fontWeight = FontWeight.ExtraBold
                )
            )
            if (expanded) {
                Box(
                    modifier = Modifier
                        .fillMaxWidth()
                        .aspectRatio(1f)
                        .padding(start = 4.dp, top = 12.dp, end = 4.dp, bottom = 4.dp)
                ) {
                    if (image != null && image.path != "") {
                        GlideImage(
                            imageModel = image,
                            // Crop, Fit, Inside, FillHeight, FillWidth, None
                            contentScale = ContentScale.Inside,
                            // shows a placeholder ImageBitmap when loading.
                            placeHolder = ImageBitmap.imageResource(R.drawable.plhdr),
                            // shows an error ImageBitmap when the request failed.
                            error = ImageBitmap.imageResource(R.drawable.plhdr)
                        )
                    } else {
                        CircularProgressIndicator(
                            modifier = Modifier
                                .align(Alignment.Center)
                                .fillMaxHeight(0.5f)
                                .aspectRatio(1f),
                        )
                    }
                }
            }
        }
        IconButton(onClick = { onClick(true) }) {
            Icon(
                imageVector = if (expanded) Icons.Filled.ExpandLess else Icons.Filled.ExpandMore,
                contentDescription = if (expanded) {
                    stringResource(R.string.show_less)
                } else {
                    stringResource(R.string.show_more)
                }
            )
        }
    }
}